<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="text">
<input type="text" value="添加" onclick="f()">
<ul>
    <li>刘备</li>
    <li>关羽</li>
    <li>张飞</li>
</ul>
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script>
    function f(){
        //创建li标签
        //把文本框的里面的值得到  赋值给li的文本内容
        //把li添加到ul里面
        let li = $("<li></li>")
        li.text($("input:first").val());
        $("ul").append(li);
    }
</script>
</body>
</html>